<template >
  <el-menu
      mode="horizontal"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
      class="mymenu"
  >
    <i class="el-icon-menu" id="menuimg"></i>
    <a id="title">河流监测系统</a>
    <el-menu-item index="1">处理中心</el-menu-item>
    <el-submenu index="2">
      <template slot="title">工作台</template>
      <el-menu-item index="2-1">选项1</el-menu-item>
      <el-menu-item index="2-2">选项2</el-menu-item>
      <el-menu-item index="2-3">选项3</el-menu-item>
    </el-submenu>
    <el-menu-item index="3">个人中心</el-menu-item>
  </el-menu>

</template>

<script>
export default {
  name: "Navindex",

}
</script>

<style scoped>
a{
  text-decoration: none;
}

span {
  pointer-events: none;
}

#menuimg{
  float:left;
  font-size: 45px;
  color: 	#00F5FF;
  padding: 8px;
  width:20px;
  margin-left: 5px;
  margin-right: 5px;
}

.mymenu{
  height: 70px;
}

#title{
  font-family:'PingFang-RE';
  color: white;
  float: left;
  padding: 14px 30px;
  margin-left: 5px;
  margin-right: 5px;
  font-size: 28px;
  letter-spacing:5px;
}
</style>
